/*公共样式*/


/*1.样式重置*/

html,
body,
header,
nav,
section,
footer,
ul,
li,
img,
a,
p,
div,
form,
input,
h1,
h2,
h3,
h4,
h5,
h6 {
    padding: 0;
    margin: 0;
    /*设置盒模型*/
    box-sizing: border-box;
    /*去除移动端特有的点击高亮效果*/
    -webkit-tap-highlight-color: transparent;
    font-weight: 400;
    border: 0;
}

html,
body {
    height: 100%;
}

body {
    font-family: "微软雅黑 Regular", sans-serif;
    font-size: 13px;
    position: relative;
}

button {
    border: none;
    outline: none;
    background: none;
    -webkit-appearance: none;
}

a,
a:hover {
    text-decoration: none;
}

ul {
    list-style: none;
}

input {
    /*1.清除文本框获取焦点时默认的边框阴影*/
    outline: none;
    /*2.去除边框*/
    border: none;
}

img {
    width: 100%;
}


/*2.清除浮动*/

.clearfix::before,
.clearfix::after {
    content: "";
    display: block;
    height: 0;
    line-height: 0px;
    clear: both;
    visibility: hidden;
}

.wrapper {
    max-width: 7.5rem;
    margin: 0 auto;
    background-color: #f5f5f5;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.show {
    display: block;
}

.hide {
    display: none;
}

.body-fixed {
    position: fixed;
}


/* 媒体查询 */

@media only screen and (min-width:280px) {
    html {
        font-size: 37.33px
    }
}

@media only screen and (min-width:320px) {
    html {
        font-size: 42.667px
    }
}

@media only screen and (min-width:360px) {
    html {
        font-size: 48px
    }
}

@media only screen and (min-width:380px) {
    html {
        font-size: 50.67px
    }
}

@media only screen and (min-width:400px) {
    html {
        font-size: 53.33px
    }
}

@media only screen and (min-width:410px) {
    html {
        font-size: 54.67px
    }
}

@media only screen and (min-width:420px) {
    html {
        font-size: 56px
    }
}

@media only screen and (min-width:440px) {
    html {
        font-size: 58.67px
    }
}

@media only screen and (min-width:460px) {
    html {
        font-size: 61.33px
    }
}

@media only screen and (min-width:480px) {
    html {
        font-size: 64px
    }
}

@media only screen and (min-width:500px) {
    html {
        font-size: 66.66px
    }
}

@media only screen and (min-width:510px) {
    html {
        font-size: 68px
    }
}

@media only screen and (min-width:520px) {
    html {
        font-size: 69.33px
    }
}

@media only screen and (min-width:530px) {
    html {
        font-size: 70.66px
    }
}

@media only screen and (min-width:540px) {
    html {
        font-size: 72px
    }
}

@media only screen and (min-width:550px) {
    html {
        font-size: 73.33px
    }
}

@media only screen and (min-width:560px) {
    html {
        font-size: 74.67px
    }
}

@media only screen and (min-width:570px) {
    html {
        font-size: 76px
    }
}

@media only screen and (min-width:580px) {
    html {
        font-size: 77.33px
    }
}

@media only screen and (min-width:590px) {
    html {
        font-size: 78.66px
    }
}

@media only screen and (min-width:600px) {
    html {
        font-size: 80px
    }
}

@media only screen and (min-width:610px) {
    html {
        font-size: 81.33px
    }
}

@media only screen and (min-width:620px) {
    html {
        font-size: 82.66px
    }
}

@media only screen and (min-width:630px) {
    html {
        font-size: 84px
    }
}

@media only screen and (min-width:640px) {
    html {
        font-size: 85.33px
    }
}

@media only screen and (min-width:650px) {
    html {
        font-size: 86.66px
    }
}

@media only screen and (min-width:660px) {
    html {
        font-size: 88px
    }
}

@media only screen and (min-width:670px) {
    html {
        font-size: 89.33px
    }
}

@media only screen and (min-width:680px) {
    html {
        font-size: 90.67px
    }
}

@media only screen and (min-width:690px) {
    html {
        font-size: 92px
    }
}

@media only screen and (min-width:700px) {
    html {
        font-size: 93.33px
    }
}

@media only screen and (min-width:720px) {
    html {
        font-size: 96px
    }
}

@media only screen and (min-width:730px) {
    html {
        font-size: 97.33px
    }
}

@media only screen and (min-width:740px) {
    html {
        font-size: 98.67px
    }
}

@media only screen and (min-width:750px) {
    html {
        font-size: 100px
    }
}

@media only screen and (min-width:760px) {
    html {
        font-size: 101.33px
    }
}

@media only screen and (min-width:800px) {
    html {
        font-size: 106.67px
    }
}

@media only screen and (min-width:840px) {
    html {
        font-size: 112px
    }
}

@media only screen and (min-width:880px) {
    html {
        font-size: 117.33px
    }
}

@media only screen and (min-width:920px) {
    html {
        font-size: 122.67px
    }
}

@media only screen and (min-width:960px) {
    html {
        font-size: 133.33px
    }
}

@media only screen and (min-width:1000px) {
    html {
        font-size: 133.33px
    }
}

@media only screen and (min-width:1040px) {
    html {
        font-size: 138.67px
    }
}

@media only screen and (min-width:1080px) {
    html {
        font-size: 144px
    }
}

@media only screen and (min-width:1120px) {
    html {
        font-size: 149.33px
    }
}

@media only screen and (min-width:1160px) {
    html {
        font-size: 154.67px
    }
}

@media only screen and (min-width:1200px) {
    html {
        font-size: 160px
    }
}

@media only screen and (min-width:1240px) {
    html {
        font-size: 165.33px
    }
}

@media only screen and (min-width:1280px) {
    html {
        font-size: 170.67px
    }
}

@media only screen and (min-width:1320px) {
    html {
        font-size: 176px
    }
}

@media only screen and (min-width:1360px) {
    html {
        font-size: 181.33px
    }
}

@media only screen and (min-width:1400px) {
    html {
        font-size: 186.67px
    }
}

@media only screen and (min-width:1440px) {
    html {
        font-size: 200px
    }
}

@media only screen and (device-width:320px) and (-webkit-min-device-pixel-ratio:2) {
    html {
        font-size: 42.667px
    }
}

@media only screen and (device-width:375px) and (-webkit-min-device-pixel-ratio:2) {
    html {
        font-size: 50px
    }
}

@media only screen and (device-width:414px) and (-webkit-min-device-pixel-ratio:2) {
    html {
        font-size: 110.4px
    }
}

@media only screen and (device-width:768px) and (-webkit-min-device-pixel-ratio:2) {
    html {
        font-size: 102.4px
    }
}